import { createStore } from "vuex";
// import { ADDNUM } from "./mutation-types";

// 创建一个新的 store 实例
// createStore要传入一个选项对象
const store = createStore({
  // state里面写的就是全局的数据
  state: {
    count: 5,
    name: "zhang",
    age: 20,
    height: 180,

    str: "hello vuex!",

    num: 1,

    n: 10,
  },

  // getters就是vuex里面的计算属性
  getters: {
    doubleCount(state) {
      return state.count * 2;
    },
    reverseStr(state, getters) {
      return state.str.split("").reverse().join("") + getters.doubleCount;
    },
  },

  // mutations里面写的是同步函数，用于改变state的值，这里是唯一可以改变state的地方
  mutations: {
    increment(state) {
      state.count++;
    },
    addNum(state, payload) {
      // mutations里面不要去写异步，会让开发工具里面的记录不准确，是在函数执行的时候记录
      state.num += payload.n;
    },
    mul(state, payload) {
      state.n *= payload.a;
    },
  },

  // actions跟mutations一样也是写函数，可以写异步函数
  // 不能去修改state的, 只能去触发mutations
  // actions函数可以接收一个参数是context
  actions: {
    asyncMul({ commit }, payload) {
      setTimeout(() => {
        // 要去触发mutations的mul
        // console.log(context);
        commit("mul", payload);
      }, 2000);
    },
  },
});

export default store;
